<template>
  <div class="fullMain">
    <x-header
      class="custumHeader"
      :left-options="{backText: '',showBack: false}">
      <a slot="left">
        <i slot="overwrite-left" class="lIcon">X</i>
      </a>
      <span>日报-条件查看</span>
      <a slot="right">
        <x-icon slot="overwrite-right" type="ios-more" size="35" style="position:relative;top:-8px;left:-3px;"></x-icon>
      </a>
    </x-header>
    <div class="mainbBg">
      <div class="menuHeader">
        <i class="fa fa-chevron-left mT returnIcon"></i>
        <span class="ids">
          学号：2017223012345
          <i class="fa fa-share-alt icons"></i>
        </span>
      </div>
      <group>
        <popup-picker :title="tjTitle" :data="tjList" v-model="tjValue" @on-show="onShow" @on-hide="onHide" @on-change="onChange" :placeholder="tjP"></popup-picker>
      </group>
      <group class="times">
        <calendar :readonly="readonly" v-model="selVal" :title="title" disable-past :placeholder="placeholder" @on-show="log('show')" @on-hide="log('hide')"></calendar>
      </group>
      <div style="display: flow-root;margin-bottom: 20px;">
        <button type="button" class="affirmBtn affirmBtn_small groupBBtn fr sViewbtn" @click="getData">查看</button>
      </div>
      <scroller lock-x scrollbar-y height="calc(100% - 240px)" :class="displayNone">
        <div class="groupDiv">
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
          <div class="chatDiv">
            <div>
              <span class="chatTime">2018-08-02 星期四</span>
              项目：物联网平台<br>
              .....<br>
              学习：论文<br>
              .....<br>
            </div>
          </div>
        </div >
      </scroller>
    </div>
  </div>
</template>

<script>
  import { XHeader } from 'vux'
  import { XInput } from 'vux'
  import { Scroller } from 'vux'
  import { Group, Calendar,PopupPicker} from 'vux'
  export default {
    name: "S_view_select",
    data(){
      return{
        readonly: false,
        selVal:"",
        title:"日期选择：",
        placeholder:"选择日期",
        projectStart:"起",
        projectEnd:"止",
        projectStartVal:"",
        projectEndVal:"",
        tjTitle: '条件(仅包括组内成员)',
        tjValue:[],
        tjList: [['小米', 'iPhone', '华为', '情怀', '三星', '其他', '不告诉你']],
        tjP:"搜索/选择",
        displayNone:"displayNone"
      }
    },
    components:{
      XHeader,
      XInput,
      Scroller,
      Group,
      Calendar,
      PopupPicker
    },
    methods:{
      onChange (val) {
        console.log('val change', val)
      },

      log (str) {
        console.log(str)
      },
      onHide () {
        console.log('on hide')
      },
      onShow () {
        console.log('on show')
      },
      getData(){
        this.displayNone = '';
      }
    }
  }
</script>

<style>

</style>
